<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>34.数组使用代理拦截操作</title>
</head>

<body>
  <script>
    //对数组进行代理，用于截取标题操作
    const lessons = [
      {
        title: "媒体查询响应式布局",
        category: "css"
      },
      {
        title: "FLEX 弹性盒模型",
        category: "css"
      },
      {
        title: "MYSQL多表查询随意操作",
        category: "mysql"
      }
    ];  
    const stringDotProxy = new Proxy(lessons, {
        get (array, key) {
          const title = array[key].title;
          const len = 10;
          array[key].title = title.length > len ? title.substr(0, len) + '.'.repeat(3)
            : title;
          return array[key];
        }
      });
    console.log(stringDotProxy[2]);
  </script>
</body>

</html>